import Collapse from "./collapse.js";
import CollapseItem from "./collapse-item.js";

window.customElements.define("heli-collapse", Collapse);
window.customElements.define("heli-collapse-item", CollapseItem);

//  设置组件默认显示的状态
let defaultActive = ['1', '2']; // name: 1, 2默认展开， 3默认隐藏

document.querySelector("heli-collapse").setAttribute("active", JSON.stringify(defaultActive));

// 每个item需要获取到defaultActive 和自己的name属性进行比较， 如果在里面就显示， 不在里面就隐藏

document.querySelector("heli-collapse").addEventListener("changeName", (e) => {
  // console.log(e.detail);
  let { isShow, name } = e.detail;
  if (isShow) {
    let index = defaultActive.indexOf(name);
    defaultActive.splice(index, 1);
  } else {
    defaultActive.push(name)
  }
  document.querySelector("heli-collapse").setAttribute("active", JSON.stringify(defaultActive));
})